$(function(){
	// 加载文章分类的方法
	var layer=layui.layer
	var form=layui.form
	iniCate()
	// 富文本编辑器	
	initEditor()
	function iniCate() {
		$.ajax({
			method:'GET',
			url:'/my/article/cates',
			success:function(res) {
				if(res.status!==0) {
					return layer.msg('初始化失败')
				}
				// 调用模板引擎渲染下拉菜单
			var htmlStr=template('tpl-cate',res)
			$('[name=cate_id]').html(htmlStr)
			// 一定要调用form.render方法（layui）
			form.render()
			}
		})
	}
	// 1. 初始化图片裁剪器
	     var $image = $('#image')
	     
	     // 2. 裁剪选项
	     var options = {
	       aspectRatio: 400 / 280,
	       preview: '.img-preview'
	     }
	     
	     // 3. 初始化裁剪区域
	     $image.cropper(options)
		 
		 // 为选择封面的按钮绑定点击事件处理函数
		 $('#btnChooseImage').on('click',function() {
			 $('#coverFile').click()
		 })
		 
		 // 监听coverFile的change事件，获取用户选择的文件列表
		 $('#coverFile').on('change',function(e) {
			 // 获取到文件的列表数组
			 var files=e.target.files
			// 判断用户是否选择了文件
			 if(files.length===0) {
				 return 
			 }
			 // 跟据文件，创建对应的URL地址
			 var newImgURL=URL.createObjectURL(files[0])
			 // 为裁剪区重新渲染
			  $image
			  .cropper('destroy')      // 销毁旧的裁剪区域
			  .attr('src', newImgURL)  // 重新设置图片路径
			  .cropper(options)        // 重新初始化裁剪区域
		 })
		 
		 // 定义文章的发布状态
		 var art_state='已发布'
		 // 为存为草稿按钮，绑定点击事件函数
		 $('#btnSava2').on('click',function() {
			 art_state='草稿'
		 })
		// 为表单绑定提交事件
		$('#form-pub').on('submit',function(e) {
			// 1.阻止表单的默认提交行为
			e.preventDefault()
			// 2.基于表单创建对象
			var fd=new FormData($(this)[0])
			// 3.将文章的发布状态，存到fd
			fd.append('state',art_state)
			// 4.将封面裁剪后的图片输出为对象
			$image
			  .cropper('getCroppedCanvas', { // 创建一个 Canvas 画布
			    width: 400,
			    height: 280
			  })
			  .toBlob(function(blob) {       // 将 Canvas 画布上的内容，转化为文件对象
			    // 得到文件对象后，进行后续的操作
			// 5.将文件对象存储到fd中
			fd.append('cover_img',blob)
			// 6.发起ajax数据请求
			publishArticle(fd)
			  })
		})
	// 定义一个发布文章的方法
	function publishArticle(fd) {
		$.ajax({
			method:'POST',
			url:'/my/article/add',
			data:fd,
			// 注意：如果向服务器提交的是FormData格式的数据，
			// 必须添加以下配置项
			contentType:false,
			processData:false,
			success:function(res) {
				if(res.status!==0) {
					return layer.msg('发布文章失败!')
				}
			layer.msg('发布文章成功')
			// 重新跳转页面
			location.href='art_list.html'
			}
		})
	}
})